import { Component, OnInit } from '@angular/core';
import { FormBuilder, FormGroup } from '@angular/forms';
import { FetchService } from '../../../core/net/fetch.service';
import { NzModalService } from 'ng-zorro-antd';
import { GateControlDetailComponent } from './gate-control-detail/gate-control-detail.component';
import { Router } from '@angular/router';

@Component({
    selector: 'app-gate-control',
    templateUrl: './gate-control.component.html',
    styleUrls: ['./gate-control.component.scss']
})
export class GateControlComponent implements OnInit {
    mngList = [];
    searchForm: FormGroup;
    gateList: Array<any> = [];
    isSketchMapTpl = true;

    constructor(private fb: FormBuilder,
                private modalService: NzModalService,
                private router: Router,
                private fetchService: FetchService) {
        this.searchForm = this.fb.group({
            watergateCode: [null],
            sectionId: [null]
            // canalName: [null]
        });
    }

    ngOnInit(): void {
        this.getMngSelectionList().then(() => {
            this.queryInfo();
        });
    }

    /**
     * 获取管理单位列表 默认传入宁西公司id
     */
    getMngSelectionList(): Promise<any> {
        return new Promise(resolve => {
            this.fetchService
                .post('wrs/wrsBmanage/list', {
                    pid: '1',   //  宁西公司
                    type: 2, //  管理所
                    pageSize: 10000
                })
                .subscribe(res => {
                    this.mngList = res['list'];
                    resolve();
                });
        });
    }

    queryInfo(): void {
        const params = this.searchForm.value;
        this.fetchService.post('base/wrsBrwaterDam/queryDamInfoList', { ...params, pageSize: 10000 }).subscribe(res => {
            this.gateList = res['list'];
        });
    }

    showDiagram(): void {

    }

    openGateDetailModal(data): void {
        const modal = this.modalService.create({
            nzTitle: data.watergateCode,
            nzClassName: 'custom-modal',
            nzWidth: '95%',
            nzBodyStyle: {
                background: '#eee',
                margin: 0,
                padding: '5px'
            },
            nzContent: GateControlDetailComponent,
            nzFooter: null,
            nzComponentParams: {
                data: data
            }
        });
        modal.afterOpen.subscribe(() => console.log('[afterOpen] emitted!'));

        // Return a result when closed
        modal.afterClose.subscribe(result => console.log('[afterClose] The result is:', result));

        // delay until modal instance created
        // setTimeout(() => {
        //     const instance = modal.getContentComponent();
        //     instance.subtitle = 'sub title is changed';
        // }, 2000);
    }

    directToList(): void {
        this.router.navigate(['/gate/gt-control-list']);
    }
}
